/**
 * Created by Allen on 2018/1/19.
 */
import React from 'react'
import { connect } from 'react-redux';
import { messages } from 'share/common';
import { Form, Input, InputNumber, Button, Select, Switch, Icon, Radio, message, Row, Col, DatePicker} from 'antd';
import SelectEmployeeGroup from 'components/template/select-employee-group'
import travelPolicyService from 'containers/expense-reimbursement-control/expense-standard/travel-policy/travel-policy.service'
import ValueRule from 'containers/expense-reimbursement-control/expense-standard/travel-policy/value-rule'
import Chooser from 'components/chooser'
import chooserData from 'share/chooserData'
import Searcher from 'components/searcher'
import moment from "moment/moment";
const { RangePicker } = DatePicker;
const FormItem = Form.Item;
const Option = Select.Option;
const RadioGroup = Radio.Group;

class NewRule extends React.Component{
  constructor(props){
    super(props);

    this.state = {
      loading: false,
      disabled: false, //只查看状态
      isNew: true,
      showSelectEmployeeGroup: false,
      showSelectDept:false,
      ticketClassOptions: [],
      chosenEmployeeIDs:[],
      travelRuleRelations: [],
      disabledCityLevelName: '', //查看页的城市级别名称
      cityOptions: [
        {levelName: messages('setting.key1037'/*通用*/), id: '000000000'},
        {levelName: messages('setting.key1173'/*其他*/), id: '111111111'}],
      scopeList: [
        {name: messages('setting.key1037'/*通用*/), value: '1001'},
        {name: messages('setting.key1174'/*仅国内*/), value: '1002'},
        {name: messages('setting.key1175'/*仅国际*/),value: '1003'}],
      value: 1001,
      applicablePersonnelType: 0,
      status: this.props.params.isNew ? 1001 : this.props.params.status,
      record: null,
      valueRuleList: [], //值列表条件规则
      discountOptions: [
        {key: 'all', value: messages('setting.key1176'/*所有*/)},
        {key: 1, value: 1},
        {key: 2, value: 2},
        {key: 3, value: 3},
        {key: 4, value: 4},
        {key: 5, value: 5},
        {key: 6, value: 6},
        {key: 7, value: 7},
        {key: 8, value: 8},
        {key: 9, value: 9},
        {key: 10, value: 10},
      ]
    }
  }

  componentWillReceiveProps(nextProps) {
    if (!nextProps.params.showSlideFrame) {
      this.clearData();
    }
    if(nextProps.params && nextProps.params == this.props.params) return
    const { type, tenantMode } = this.props;
    this.setState({chosenEmployeeIDs: []});
    if (nextProps.type === 'standard') {    //差标
      if (nextProps.id === '1002' || nextProps.id === '1001') {
        this.getTicketOptions(Number(nextProps.id));//获取火车座席,机票仓等
      }
      if (!nextProps.params.isNew) {  //编辑
        if (nextProps.params.record && nextProps.params.record.source === 1001 && !tenantMode) {
          this.setState({disabled: true});
        }
        this.setState({
          record: nextProps.params.record,
          status: nextProps.params.record.status
        }, () => {
          if (nextProps.id === '1003' || nextProps.id === '1010' || nextProps.id === '1008') {
            this.renderCityLevelName();
          }
          if (this.state.record.travelRuleRelations[0].type === 1001) {
            this.setState({value: 1001, chosenEmployeeIDs: []})
          } else {
            let groups = [];
            this.state.record.travelRuleRelations && this.state.record.travelRuleRelations.map(item => {
              if (item.type === 1002) {
                let temValue = {
                  value: item.relationOID
                };
                groups.push(temValue);
              }
            });
            this.setState({value: 1002, chosenEmployeeIDs: groups})
          }
        });
      } else if (nextProps.params.isNew) {                      //新建
        let groups = [];
        nextProps.record && nextProps.record.travelRuleRelations.map(item => {
          let temValue = {
            value: item.relationOID
          };
          if(temValue.value) {
            groups.push(temValue);
          }
        });
        this.setState({record: null, status: 1001, value: groups.length>0 ? 1002 : 1001,chosenEmployeeIDs: groups});
      }
    } else {
      if (!nextProps.params.isNew) {  //编辑
        this.setState({
          record: nextProps.params.record,
          status: nextProps.params.record.status
        }, () => {
          let groups = [];
          this.state.record.userGroupDTOs && this.state.record.userGroupDTOs.map(item => {
            let tempValue = {
              value: item.userGroupOID
            }
            groups.push(tempValue)
          });
          this.setState({value: groups.length>0 ? 1: 0, chosenEmployeeIDs: groups})
        });
      } else if (nextProps.params.isNew) {                      //新建
        let groups = [];
          nextProps.record && nextProps.record.userGroupDTOs && nextProps.record.userGroupDTOs.map(item=>{
            let tempValue = {
              value: item.userGroupOID
            }
            groups.push(tempValue)
          })
        this.setState({record: null, status: 0, value: groups.length>0 ? 1: 0,chosenEmployeeIDs:groups});
      }
    }
  }

  clearData = () => {
    this.props.form.resetFields();
    this.userGroupInit();
    this.setState({record: null, valueRuleList: [], disabled: false, disabledCityLevelName: ''});
  };

    onCancel = () => {
      this.props.form.resetFields();
      this.userGroupInit();
      this.setState({record: null, valueRuleList: [], disabled: false});
      this.props.close()
    };

  componentDidMount(){
    this.getCityOptions()
  }

    //获取机票、火车票类型
    getTicketOptions = (id) => {

      travelPolicyService.getTicketClass(id ? id : this.props.id).then((resp) => {
        if (resp.status === 200) {
          resp.data.unshift({
            code: messages('setting.key1176'/*所有*/),
            name: messages('setting.key1176'/*所有*/)
          });
          this.setState({ticketClassOptions: resp.data});
        }
      })
    };

    //获取城市级别
    getCityOptions = () => {
      travelPolicyService.getCityLevels().then((resp) => {
        let citys = [{levelName: messages('setting.key1037'/*通用*/), levelOID: '000000000'},
          {levelName: messages('setting.key1173'/*其他*/), levelOID: '111111111'}];
        for(let i=0;i<resp.data.length;i++){
          if(!resp.data[i].deleted){
            citys.push(resp.data[i]);
          }
        }
        this.setState({cityOptions: citys});
      })
    };

    changeLevelName = (value) => {
      if (value === messages('setting.key1037'/*通用*/)) {
        this.setState({levelType: 0, levelOID: null});
      } else if (value === messages('setting.key1173'/*其他*/)) {
        this.setState({levelType: 2, levelOID: null})
      } else {
        this.setState({levelType: 1})
      }
    };

    changeStatus = (checked) => {
      const {type} = this.props;
      if (checked) {
        this.setState({status: type === 'standard' ? 1001 : 0})
      } else {
        this.setState({status: type === 'standard' ? 1002 : 1})
      }
    };

    updateValueRuleList = (valueRuleList) => {
      this.setState({valueRuleList: valueRuleList});
    };

    //适用人员初始化
    userGroupInit = () => {
      this.setState({
        chosenEmployeeIDs: [],
      })
    };

    handleSelectEmployeeCancel = () => {
      this.setState({showSelectEmployeeGroup: false, showSelectDept: false})
    };

    handleSelectEmployeeOk = (values) => {
      let IDs = [];
      values.checkedEntites.map(item => {
        let tempValue = {
          value:item.userGroupOID
        }
        IDs.push(tempValue)
      });
      this.setState({
        chosenEmployeeIDs: IDs
      });
      this.handleSelectEmployeeCancel()
    };

    //选择人员组
    handleShowGroupModal = () => {
      const {type} = this.props;
      this.refs.chooserGroupBlur.focus();
      if (type === 'standard') {
        this.setState({
          showSelectEmployeeGroup: type === 'standard' ? this.state.value === 1002 : this.state.applicablePersonnelType === 1
        })
      } else {
        this.setState({showSelectEmployeeGroup: this.state.value === 1})
      }
    };

    //改变启用状态
    onChange = (e) => {
      this.setState({
        value: e.target.value
      }, () => {
        this.setState({chosenEmployeeIDs: []})
      });
    };

    //适用人员设置
    subsidyChange = (e) => {
      let value = e.target.value
      this.setState({applicablePersonnelType: value, value: value});
    };

    //保存操作
    handleSave = (e) => {
      const { type, isNew, typeId, tenantMode, id: travelTypeStr, sceneId } = this.props;
      const { chosenEmployeeIDs, applicablePersonnelType, levelType, value,record,cityOptions, valueRuleList } = this.state;
      let travelRuleRelations = [];
      e.preventDefault();
      this.props.form.validateFieldsAndScroll((err, values) => {
        if (!err) {
          let params = {};
          let method;
          params = Object.assign(params, values);
          method = isNew ? 'post' : 'put';
          if (type === 'standard') {   //差旅标准规则保存
            params.comment = params.comment.replace(/\s+/g,"");
            if (!params.comment){
              message.error(messages('setting.key1177'/*请输入规则描述*/));
              return false;
            }
            if (value === 1002 && chosenEmployeeIDs.length < 1) {
              message.error(messages('setting.key788'/*请选择人员组*/));
              return;
            }
            if (chosenEmployeeIDs.length !== 0) {
              chosenEmployeeIDs.map(item => {
                travelRuleRelations.push({type: 1002, relationOID: item.value});
                return Array.from(travelRuleRelations);
              });
            } else {
              travelRuleRelations = [{type: 1001, relationOID: null}]
            }
            params.comment = params.comment.replace(/\s+/g,"");
            params.status = params.status === true ? 1001 : 1002;
            params.id = isNew ? null : this.props.params.record.id;
            params.travelItineraryStandID = this.props.params.travelItineraryStandID;
            params.travelRuleRelations = travelRuleRelations;
            //真就绝了，用length来判断类型，我吐了
            switch(travelTypeStr) {
              case '1001': //机票
                params.travelRuleConditions[0].code = 1001;
                params.travelRuleConditions[1].code = 1002;
                params.travelRuleConditions[2].code = 1008;
                params.travelRuleConditions[0].name = 'flightSeatClass';
                params.travelRuleConditions[1].name = 'flightDiscount';
                params.travelRuleConditions[2].name = 'flightScope';
                break;
              case '1002': //火车
                params.travelRuleConditions[0].code = 1003;
                params.travelRuleConditions[0].name = 'trainSeatClass';
                break;
              case '1003': //酒店
                params.travelRuleConditions[4] = {};
                params.travelRuleConditions[5] = {};
                params.travelRuleConditions[0].code = 1006;
                params.travelRuleConditions[1].code = 1005;
                params.travelRuleConditions[2].code = 1004;
                params.travelRuleConditions[3].code = 1007;
                params.travelRuleConditions[4].code = 1008;
                params.travelRuleConditions[5].code = 1009;
                params.travelRuleConditions[0].name = 'cityLevel';
                params.travelRuleConditions[1].name = 'currency';
                params.travelRuleConditions[2].name = 'amount';
                params.travelRuleConditions[3].name = 'hotelUniformBooking';
                params.travelRuleConditions[4].name = 'fromDate';
                params.travelRuleConditions[5].name = 'endDate';
                params.travelRuleConditions[4].value = moment(params.enableDates[0]).format('YYYY-MM-DD');
                params.travelRuleConditions[5].value = moment(params.enableDates[1]).format('YYYY-MM-DD');
                delete params.enableDates;
                break;
              case '1008': //用车
                params.visibleFormScope = (params.customFormDTOs && params.customFormDTOs.length) ? 2 : 1; //适用表单范围，1全部 2部分
                params.travelRuleConditions[0].code = 1006;
                params.travelRuleConditions[1].code = 1005;
                params.travelRuleConditions[2].code = 1004;
                params.travelRuleConditions[0].name = 'cityLevel';
                params.travelRuleConditions[1].name = 'currency';
                params.travelRuleConditions[2].name = 'amount';
                break;
              case '1010': //用餐
                params.diningSceneId = sceneId;
                params.travelRuleConditions[0].code = 1006;
                params.travelRuleConditions[1].code = 1005;
                params.travelRuleConditions[2].code = 1004;
                params.travelRuleConditions[0].name = 'cityLevel';
                params.travelRuleConditions[1].name = 'currency';
                params.travelRuleConditions[2].name = 'amount';
                break;
            }
            params.customEnumerationDTOs = [];
            valueRuleList.map(oneRule => {
              if (oneRule.value) {
                let oneRuleData = {};
                oneRuleData.customEnumerationOID = oneRule.value;
                oneRuleData.values = [];
                oneRule.valueItem.map(valueId => {
                  oneRuleData.values.push({id: valueId});
                });
                params.customEnumerationDTOs.push(oneRuleData);
              }
            });
            params.travelRuleCompanyList = [];
            tenantMode && params.companys && params.companys.map(company => {
              params.travelRuleCompanyList.push({companyId: company.id});
            });
            this.setState({loading: true});
            travelPolicyService.saveTravelStandardRule(method, params).then((resp) => {
              this.setState({loading: false});
              message.success(messages('common.save.success', {name: params.comment}));
              this.props.form.resetFields();
              this.userGroupInit();
              this.props.close(true);
            }).catch((e) => {
              const errObj = e.response;
              if (errObj) {
                message.error((errObj && errObj.data && errObj.data.message) || messages('common.save.filed'));
                this.setState({loading: false, travelRuleRelations: []});
              }
            })
          } else if (type === 'subsidy') {
            if (value === 1 && chosenEmployeeIDs.length < 1) {
              message.error(messages('setting.key788'/*请选择人员组*/));
              return
            }
            this.setState({loading: true});
            params.expenseTypeOID = typeId;
            params.applicablePersonnelType = value;
            params.levelType = cityOptions.filter(item =>item.levelOID === values.levelOID)[0].levelName === messages('setting.key1037'/*通用*/) ? 0 : cityOptions.filter(item =>item.levelOID === values.levelOID)[0].levelName === messages('setting.key1173'/*其他*/) ? 2 : 1;
            params.travelStandardOID = isNew ? null : record.travelStandardOID;
            params.status = values.status ? 0 :1;
            if(params.levelType === 0 || params.levelType === 2){
              params.levelOID = null;
            }
            chosenEmployeeIDs.length > 0 && (params.userGroupOIDArray = chosenEmployeeIDs.map(item =>item.value))
            travelPolicyService.saveTravelSubsidyRule(method, params).then((resp) => {
              this.setState({loading: false});
              message.success(messages('common.save.success', {name:''}));
              this.props.form.resetFields();
              this.props.close(true);
            }).catch((e) => {
              this.props.form.resetFields();
              this.props.close(true);
              if (e.response) {
                message.error(messages('common.save.filed'));
              }
              this.setState({loading: false});
            })
          }
        }
      })
    };

    handleCityLevel=(record) =>{
      if(record.levelOID === null){
        if(record.levelType ===2){
          return '111111111'
        }
        return '000000000'
      }else{
        return record.levelOID
      }
    }

    getCompanyInit = (companyList) => {
      const { tenantMode, company, params } = this.props;
      let resultList = [];
      companyList && companyList.map(companyItem => {
        resultList.push({
          id: companyItem.companyId,
          name: companyItem.companyName
        });
      });
      if (!resultList.length && params.isNew && !tenantMode) {
        resultList.push({
          id: company.id,
          name: company.name
        });
      }
      return resultList;
    };

    renderCityLevelName = () => {
      const { record } = this.state;
      const { disabledCityLevelName } = this.state;
      let levelName = messages('setting.key1037'/*通用*/);
      let levelOID = record ? record.travelRuleConditions[0].value : '';
      if (levelOID === '111111111') {
        levelName = messages('setting.key1173'/*其他*/);
      }
      if (disabledCityLevelName) {
        return;
      }
      if (levelOID && levelOID !== '000000000' && levelOID !== '111111111') {
        travelPolicyService.getCityLevelDetail(levelOID).then((resp) => {
          this.setState({disabledCityLevelName: resp.data.levelName});
        });
      } else {
        this.setState({disabledCityLevelName: levelName});
      }
    };

    render() {
      const { getFieldDecorator, getFieldValue } = this.props.form;
      const { ticketClassOptions, loading, discountOptions, status, showSelectEmployeeGroup, chosenEmployeeIDs,
        scopeList, cityOptions, disabled, disabledCityLevelName } = this.state;
      const { params, id, type, record, showSlideFrame, tenantMode, company, setOfBooksId } = this.props;
      const formItemLayout = {
        labelCol: {span: 6},
        wrapperCol: {span: 10, offset: 1}
      };
      const formItemLayoutBig = {
        labelCol: {span: 6},
        wrapperCol: {span: 17, offset: 1}
      };
      let enableFromDate = null;
      let enableEndDate = null;
      if (id === '1003') {
        const travelRuleConditionsHotel = (record && record.travelRuleConditions) || [];
        enableFromDate = travelRuleConditionsHotel[4] && moment(moment(travelRuleConditionsHotel[4].value), 'YYYY-MM-DD');
        enableEndDate = travelRuleConditionsHotel[5] && moment(moment(travelRuleConditionsHotel[5].value), 'YYYY-MM-DD');
      }

      return (
        <div>
          <Form onSubmit={this.handleSave}>
            {/*差旅标准设置*/}
            {type === 'standard' && (
              <FormItem {...formItemLayout} label={messages('setting.key1178'/*规则描述*/)}>
                {getFieldDecorator('comment', {
                  rules: [{
                    required: true,
                    message: messages('common.please.enter')
                  }],
                  initialValue: record ? record.comment : ''
                })(
                  <Input placeholder={messages('common.please.enter')} maxLength="10" disabled={disabled}/>
                )}
              </FormItem>
            )}
            {type === 'standard' && (
              <FormItem {...formItemLayout} label={messages('common.status.enable')/*启用(*/}>
                {getFieldDecorator('status', {
                  initialValue: status === 1001 ? true : false,
                  valuePropName: 'checked'
                })(
                  <Switch checkedChildren={<Icon type="check"/>}
                          disabled={disabled}
                          unCheckedChildren={<Icon type="cross"/>} onChange={this.changeStatus}/>
                )}
              </FormItem>
            )}
            {/*机票*/}
            {id === '1001' && (
              <FormItem {...formItemLayout} label={messages('setting.key1179'/*范围*/)}>
                {getFieldDecorator('travelRuleConditions[2].value', {
                  rules: [{
                    required: true,
                    message: messages('common.please.select')
                  }],
                  initialValue: record ? record.travelRuleConditions[2].value : scopeList[0].value
                })(
                  <Select disabled={disabled}>
                    {scopeList.map((item) => (
                      <Option value={item.value} key={item.value}>{item.name}</Option>
                    ))}
                  </Select>
                )}
              </FormItem>
            )}
            {id === '1001' && (
              <FormItem {...formItemLayout} label={messages('setting.key706'/*舱等*/)}>
                {getFieldDecorator('travelRuleConditions[0].value', {
                  rules: [{
                    required: true,
                    message: messages('common.please.select')
                  }],
                  initialValue: record ? record.travelRuleConditions[0].value : (ticketClassOptions.length !== 0 ? ticketClassOptions[1].name : '')
                })(
                  <Select disabled={disabled}>
                    {ticketClassOptions.map(item => {
                      return <Option value={item.name} key={item.name}>{item.name}</Option>
                    })}
                  </Select>
                )}
              </FormItem>
            )}
            {id === '1001' && (
              <FormItem {...formItemLayout} label={messages('setting.key704'/*折扣*/)}>
                {getFieldDecorator('travelRuleConditions[1].value', {
                  rules: [{
                    required: true,
                    message: messages('common.please.select')
                  }],
                  initialValue: record ? record.travelRuleConditions[1].value : 10
                })(
                  <Select disabled={disabled}>
                    {discountOptions.map(item => {
                      return <Option value={item.value} key={item.key}>{item.value}</Option>
                    })}
                  </Select>
                )}
              </FormItem>
            )}

            {/*火车*/}
            {id === '1002' && (
              <FormItem {...formItemLayout} label={messages('setting.key719'/*座席*/)}>
                {getFieldDecorator('travelRuleConditions[0].value', {
                  rules: [{
                    required: true,
                    message: messages('common.please.select')
                  }],
                  initialValue: record ? record.travelRuleConditions[0].value : (ticketClassOptions.length !== 0 ? ticketClassOptions[2].name : '')
                })(
                  <Select disabled={disabled}>
                    {ticketClassOptions.map(item => {
                      return <Option value={item.code} key={item.name}>{item.name}</Option>
                    })}
                  </Select>
                )}
              </FormItem>
            )}

            {/*酒店*/}
            {/*用餐*/}
            {/*用车*/}
            {(id === '1003' || id === '1010' || id === '1008') && !disabled && (
              <FormItem {...formItemLayout} label={messages('setting.key1180'/*城市级别*/)}>
                {getFieldDecorator('travelRuleConditions[0].value', {
                  rules: [{
                    required: true,
                    message: messages('common.please.select')
                  }],
                  initialValue: record ? record.travelRuleConditions[0].value : '000000000'
                })(
                  <Select onFocus={this.getCityOptions} disabled={disabled}>
                    {cityOptions.map(item => {
                      return <Option value={item.levelOID} key={item.levelOID}>{item.levelName}</Option>
                    })}
                  </Select>
                )}
              </FormItem>
            )}
            {(id === '1003' || id === '1010' || id === '1008') && disabled && (
              <FormItem {...formItemLayout} label={messages('setting.key1180'/*城市级别*/)}>
                <Input value={disabledCityLevelName} disabled />
              </FormItem>
            )}
            {(id === '1003' || id === '1010' || id === '1008') && (
              <FormItem {...formItemLayout} label={messages('setting.key1181'/*币种*/)}>
                {getFieldDecorator('travelRuleConditions[1].value', {
                  rules: [{
                    required: true,
                    message: messages('common.please.select')
                  }],
                  initialValue: 'CNY'
                })(
                  <Input disabled={true}/>
                )}
              </FormItem>
            )}
            {(id === '1003' || id === '1010' || id === '1008') && (
              <FormItem {...formItemLayout} label={id === '1003' ? messages('setting.key1182'/*最大金额*/) : messages('common.amount')/*金额*/}>
                {getFieldDecorator('travelRuleConditions[2].value', {
                  rules: [{
                    required: true,
                    message: messages('common.please.enter')
                  }],
                  initialValue: record ? record.travelRuleConditions[2].value : null
                })(
                  <InputNumber placeholder={messages('common.please.enter')} precision={2} step={0.01}
                               disabled={disabled}
                               style={{width: '100%'}}/>
                )}
              </FormItem>
            )}
            {id === '1008' && (
              <FormItem {...formItemLayout} label={messages('expense-reimbursement-control.key99')/*适用表单*/}>
                {getFieldDecorator('customFormDTOs', {
                  initialValue: record ? record.customFormDTOs : []
                })(
                  <Searcher
                    type="form_tenant_company"
                    listExtraParams={{
                      setOfBooksId: tenantMode ? setOfBooksId : company.setOfBooksId,
                      companyOID: tenantMode ? undefined : company.companyOID,
                      formTypeList: [2001],
                      page: 0,
                      size: 1000
                    }}
                    disabled={disabled}
                    labelKey="formName"
                    descriptionKey="companyName"
                    isAll={!getFieldValue('customFormDTOs') || getFieldValue('customFormDTOs').length === 0}
                    isShowSelectAll
                    showNumber
                    showClear
                  />
                )}
              </FormItem>
            )}
            {id === '1003' && (
              <Row>
                <Col span={24} style={{position:'relative'}}>
                  <FormItem {...formItemLayout} label={messages('setting.key1512')/*是否合住*/}>
                    {getFieldDecorator('travelRuleConditions[3].value', {
                      initialValue: record ? eval(record.travelRuleConditions[3].value) : false,
                      valuePropName: 'checked'
                    })(
                      <Switch checkedChildren={<Icon type="check"/>}
                              disabled={disabled}
                              unCheckedChildren={<Icon type="cross"/>}/>
                    )}
                  </FormItem>
                  <span style={{position:'absolute',left: '40%',top: 6,color:'red'}}>*{messages('setting.key1183'/*请确保所有员工性别已维护*/)}！</span>
                </Col>
              </Row>

            )}
            {type === 'standard' && (
              <FormItem {...formItemLayout} label={messages('setting.key1036'/*适用人员设置*/)}>
                <RadioGroup onChange={this.onChange} value={this.state.value} disabled={disabled}>
                  <Radio key="generalduty" name="personArea"
                         value={1001}>{messages('setting.key1037'/*通用*/)}</Radio>
                  <Radio key="selectFromStaffGroup" name="personArea"
                         value={1002}>{messages('setting.key1038'/*从人员组选择*/)}</Radio>
                </RadioGroup>
                {this.state.value === 1002 && (
                  <div>
                    <Select placeholder={messages('common.please.select')}
                            disabled={disabled}
                            onFocus={this.handleShowGroupModal}
                            dropdownStyle={{display: 'none'}}/>
                    <div className={`chooser-number ${chosenEmployeeIDs.length && 'have-num'}`}
                         onClick={this.handleShowGroupModal}>
                      {messages('setting.key1468',{arg1: chosenEmployeeIDs.length}/*已选择{arg1}个人员组*/)}
                    </div>
                    <input ref="chooserGroupBlur"
                           style={{position: 'absolute', top: '-9999vh', zIndex: -1}}/>
                  </div>
                )}
              </FormItem>
            )}

            {type === 'standard' && (
              <FormItem {...formItemLayout} label={messages('expense-reimbursement-control.key73')/*适用公司设置*/}>
                {getFieldDecorator('companys', {
                  initialValue: this.getCompanyInit(record && record.travelRuleCompanyList)
                })(
                  <Chooser type="available_company_setOfBooks"
                           valueKey="id"
                           labelKey="name"
                           listExtraParams={tenantMode ? {setOfBooksId: setOfBooksId} : undefined}
                           disabled={!tenantMode || disabled}
                           placeholder={messages('setting.key1037'/*通用*/)}/>
                )}
              </FormItem>
            )}

            {/*差旅补贴设置*/}
            {type === 'subsidy' && (
              <FormItem {...formItemLayout} label={messages('setting.key1180'/*城市级别*/)}>
                {getFieldDecorator('levelOID', {
                  rules: [{
                    required: true,
                    message: messages('common.please.select')
                  }],
                  initialValue: record ? this.handleCityLevel(record) : cityOptions[0].levelOID
                })(
                  <Select>
                    {cityOptions.map(item => {
                      return <Option value={item.levelOID} key={item.levelOID}>{item.levelName}</Option>
                    })}
                  </Select>
                )}
              </FormItem>
            )}
            {type === 'subsidy' && (
              <FormItem {...formItemLayout}
                        label={messages('setting.key1184'/*金额限制（每人每天）*/)}>
                {getFieldDecorator('amount', {
                  rules: [{
                    required: true,
                    message: messages('common.please.enter')
                  }],
                  initialValue: record ? record.amount : null
                })(
                  <InputNumber placeholder={messages('common.please.enter')} min={0} precision={2} step={0.01}
                               style={{width: '100%'}}/>
                )}
              </FormItem>
            )}
            {type === 'subsidy' && (
              <FormItem {...formItemLayout} label={messages('common.status.enable')/*启用(*/}>
                {getFieldDecorator('status', {
                  initialValue: status === 0 ,
                  valuePropName: 'checked'
                })(
                  <Switch checkedChildren={<Icon type="check"/>}
                          unCheckedChildren={<Icon type="cross"/>} onChange={this.changeStatus}/>
                )}
              </FormItem>
            )}
            {type === 'subsidy' && (
              <FormItem {...formItemLayout} label={messages('setting.key1036'/*适用人员设置*/)}>
                {getFieldDecorator('permission', {
                })(
                <div>
                <RadioGroup onChange={this.subsidyChange} value={this.state.value}>
                  <Radio key="generalduty" name="personArea"
                         value={0}>{messages('setting.key1037'/*通用*/)}</Radio>
                  <Radio key="selectFromStaffGroup" name="personArea"
                         value={1}>{messages('setting.key1038'/*从人员组选择*/)}</Radio>
                </RadioGroup>
                {this.state.value === 1 && (
                  <div>
                    <Select placeholder={messages('common.please.select')}
                            onFocus={this.handleShowGroupModal}
                            dropdownStyle={{display: 'none'}}/>
                    <div className={`chooser-number ${chosenEmployeeIDs.length && 'have-num'}`}
                         onClick={this.handleShowGroupModal}>
                      {messages('setting.key1468',{arg1: chosenEmployeeIDs.length}/*已选择{arg1}个人员组*/)}
                    </div>
                    <input ref="chooserGroupBlur"
                           style={{position: 'absolute', top: '-9999vh', zIndex: -1}}/>
                  </div>
                )}
                </div>
                )}
              </FormItem>
            )}

            {/*生效起止时间设置*/}
            {id === '1003' && (
              <FormItem {...formItemLayout} label={messages('mcd.enable.dates'/*生效起止时间*/)}>
                {getFieldDecorator('enableDates', {
                  rules: [{
                    required: true,
                    message: messages('common.please.select')
                  }],
                  initialValue: (enableFromDate && enableEndDate) ?
                    [enableFromDate, enableEndDate] : undefined
                })(
                  <RangePicker
                    style={{width: '100%'}}
                    allowClear={false}
                    format="YYYY-MM-DD"
                    placeholder={[messages('setting.key578'/*开始日期*/), messages('setting.key578'/*结束日期*/)]}
                  />
                )}
              </FormItem>
            )}

            {type === 'standard' && id !== '1010' && id !== '1008' && (
              <FormItem {...formItemLayoutBig} label={messages('setting.key1185'/*规则生效条件*/)}>
                <ValueRule data={record} isShow={showSlideFrame} onChange={this.updateValueRuleList} disabled={disabled}/>
              </FormItem>
            )}

            <div className="slide-footer">
              {!disabled && (
                <Button type="primary" htmlType="submit"
                        loading={loading}>{messages('common.ok')/*确定(*/}</Button>
              )}
              <Button onClick={this.onCancel}>{messages('common.cancel')/*返回(*/}</Button>
            </div>
          </Form>
          <SelectEmployeeGroup visible={showSelectEmployeeGroup}
                               onCancel={this.handleSelectEmployeeCancel}
                               onOk={this.handleSelectEmployeeOk}
                               selectedData={chosenEmployeeIDs}
                               mode='oid'
                               entity={true}/>
        </div>
      )
    }
  }

function mapStateToProps(state) {
  return {
    company: state.login.company,
    tenantMode: state.main.tenantMode
  }
}
const WrappedNewRule = Form.create()(NewRule);

export default connect(mapStateToProps)(WrappedNewRule)

